<template>
    <view>
        <view v-if="isLoad === null" class="margin-top load notexist text-l text-grey"></view>
        <view v-if="isLoad === false" class="margin-top load loading text-l text-grey"></view>

        <block v-if="isAdmin">
            <view class="main-admin">
                <view class="text-pic-list-box">
                    <view class="item shadow" v-for="(item, index) in temps" :key="index">
                        <view class="title">
                            <text @tap="bindSelectTap" :data-idx="index" class="temp-name text-cut">{{ item.TEMP_NAME }}</text>
                            <button @tap="bindSelectTap" :data-idx="index" class="btn mid bg-admin text-white margin-right-s" style="font-weight: normal">选用</button>
                            <text @tap="bindOprtTap" :data-idx="index" class="icon-moreandroid more"></text>
                        </view>

                        <view class="time-list">
                            <view wx-for class="time-item" v-for="(timesItem, timesIndex) in item.TEMP_TIMES" :key="timesIndex">
                                <view class="detail">
                                    <text class="up">{{ timesItem.start }}～{{ timesItem.end }}</text>
                                    <text v-if="timesItem.isLimit" class="text-admin">{{ timesItem.limit }}人</text>
                                    <text v-else class="text-admin">不限人数</text>
                                </view>
                            </view>
                        </view>
                    </view>
                </view>
            </view>

            <cmpt-modal :show.sync="curTimeModalShow" type="dialog" title="批量设置人数上限" @click="bindAllLimitSetCmpt" class="modal-form">
                <view class="modal-desc text-green">统一设置该模板下各时段可约人数</view>

                <view class="form-group">
                    <view class="title">是否限制人数</view>
                    <switch v-if="curTimeIsLimit" @change="switchModel" data-item="curTimeIsLimit" class="green sm" :checked="true"></switch>
                    <switch v-else-if="!curTimeIsLimit" @change="switchModel" data-item="curTimeIsLimit" class="green sm"></switch>
                </view>
                <view class="form-group">
                    <view class="title">人数上限</view>
                    <block v-if="curTimeIsLimit">
                        <input type="number" maxlength="4" placeholder="请输入本时段人数上限" v-model="curTimeLimit" class="text-red margin-right-xs" />
                        人
                    </block>
                    <text v-else>不限制人数</text>
                </view>
            </cmpt-modal>
        </block>
    </view>
</template>

<script>
const AdminBiz = require('../../../../biz/admin_biz.js');
const pageHelper = require('../../../../helper/page_helper.js');
const cloudHelper = require('../../../../helper/cloud_helper.js');
const AdminMeetBiz = require('../../../../biz/admin_meet_biz.js');
export default {
    data() {
        return {
            isLoad: false,
            temps: [],
            curIdx: -1,
            curTimeModalShow: false,
            curTimeIsLimit: false,

            // 当前操作是否限制人数
            // 当前时段人数限制
            curTimeLimit: 50,

            days: '',
            isAdmin: false,
            timesIndex: 0,

            timesItem: {
                start: '',
                end: '',
                isLimit: '',
                limit: ''
            }
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: async function (options) {
        if (!AdminBiz.isAdmin(this)) {
            return;
        }
        await this.loadListFun();
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    onPullDownRefresh: async function () {
        await this.loadListFun();
        uni.stopPullDownRefresh();
    },
    methods: {
        switchModel: function (e) {
            pageHelper.switchModel(this, e, 'bool');
        },

        bindAllLimitSetCmpt: async function (e) {
            if (this.curIdx <= -1) {
                return;
            }
            let temp = this.temps[this.curIdx];
            try {
                let opts = {
                    title: '批量修改中'
                };
                let params = {
                    id: temp._id,
                    limit: this.curTimeLimit,
                    isLimit: this.curTimeIsLimit
                };
                await cloudHelper.callCloudSumbit('admin/temp_edit', params, opts).then((res) => {
                    this.setData({
                        temps: res.data,
                        curTimeModalShow: false,
                        curTimeIsLimit: false,
                        curTimeLimit: 50
                    });
                    pageHelper.showSuccToast('修改成功');
                });
            } catch (err) {
                console.log('CatchClause', err);
                console.log('CatchClause', err);
                console.log(err);
            }
        },

        loadListFun: async function () {
            try {
                let opts = {
                    title: 'bar'
                };
                await cloudHelper.callCloudSumbit('admin/temp_list', {}, opts).then((res) => {
                    this.setData({
                        isLoad: res.data.length == 0 ? null : true,
                        temps: res.data
                    });
                });
            } catch (err) {
                console.log('CatchClause', err);
                console.log('CatchClause', err);
                console.log(err);
            }
        },

        bindSelectTap: function (e) {
            let curIdx = pageHelper.dataset(e, 'idx');
            let temps = this.temps[curIdx].TEMP_TIMES;
            let name = this.temps[curIdx].TEMP_NAME;
            let parent = pageHelper.getPrevPage(2);
            if (!parent) {
                return;
            }
            let days = parent.data.days;
            let day = days[parent.data.curIdx].day;
            let callback = () => {
                let times = [];
                for (let k in temps) {
                    let node = AdminMeetBiz.getNewTimeNode(day);
                    node.start = temps[k].start;
                    node.end = temps[k].end;
                    node.limit = temps[k].limit;
                    node.isLimit = temps[k].isLimit;
                    times.push(node);
                }
                days[parent.data.curIdx].times = times;
                parent.setData({
                    days
                });
                uni.navigateBack({
                    delta: 0
                });
            };
            pageHelper.showConfirm('确认要选用模板 「' + name + '」配置到日期 「' + day + '」下吗?', callback);
        },

        delTempFun: async function (curIdx, id) {
            try {
                let opts = {
                    title: '删除中'
                };
                let params = {
                    id
                };
                await cloudHelper.callCloudSumbit('admin/temp_del', params, opts).then((res) => {
                    let temps = this.temps;
                    temps.splice(curIdx, 1);
                    this.setData({
                        temps
                    });
                });
            } catch (err) {
                console.log('CatchClause', err);
                console.log('CatchClause', err);
                console.log(err);
            }
        },

        bindOprtTap: function (e) {
            let curIdx = pageHelper.dataset(e, 'idx');
            let itemList = ['删除模板', '批量设置人数上限'];
            uni.showActionSheet({
                itemList,
                success: async (res) => {
                    let idx = res.tapIndex;
                    if (idx == 0) {
                        // 删除
                        let temps = this.temps;
                        let name = temps[curIdx].TEMP_NAME;
                        let callback = () => {
                            this.delTempFun(curIdx, temps[curIdx]._id);
                        };
                        pageHelper.showConfirm('确认要删除模板 「' + name + '」吗?', callback);
                    }
                    if (idx == 1) {
                        this.setData({
                            curIdx,
                            curTimeModalShow: true
                        });
                    }
                },
                fail: function (res) {}
            });
        }
    }
};
</script>
<style>
@import './admin_temp_select.css';
</style>
